<template>
    <div v-bind:style="{'background-color':pink,width:width,height:height+'px'}">
    <div v-bind:style="{backgroundColor:isBlue?blue:'black',width:'50px',height:'20px'}"></div>
    <div v-bind:style="myDiv"></div>

    </div>
    
</template>
<script setup>
import { ref ,reactive} from 'vue'
const isBlue=ref(false)
const blue=ref('blue')
const pink=ref('pink')
const width=ref('100')
const height=ref(70)
const myDiv=reactive({
    width:'50px',
    height:'50px',
    backgroundColor:'red'
})


</script>